<!--管理员=》商家列表-->
<template>
	<div>
	  <MainContent>
		 <div class="content_title">
		 	<span style="color: #222222;font-size: 24px;font-weight: 400;">{{title}}</span>
		 	
		 </div>
		 <div class="table_content">
		 	<el-row>
		 		<div style="display: flex;justify-content: space-between;align-items: center;">
		 			<span>我的店铺列表</span>
					<button class="el-button mini addBuss" @click="addStore"> 添加店铺</button>
		 		</div>

			   <el-table
		        ref="multipleTable"
		        :data="storeListData"
		        style='width: 99%;margin-top:70px;'
		        tooltip-effect="dark">
						
		        <el-table-column
		          align="center"
		          type='index'
							style='width:150px!important'
		          label="#">
		        </el-table-column>
		        <el-table-column
		          align="center"
		          prop="StoreName"
		          label="店铺名称">
		        </el-table-column>
		       	
		        <el-table-column
		          align="center"
		          label="操作">
		          <template slot-scope="scope">
		            	<el-button
				              size="mini"
				              type='danger'
				              @click="delectStore(scope.$index, scope.row)">删除</el-button>
				   </template>
		        </el-table-column>
		     </el-table>
		 	</el-row>
		 	<el-row style='margin-top: 20px;text-align: center;'>
			 	<el-pagination 
					  @current-change="handleCurrentChange"
					  :current-page="currentPage"
		        	   layout="prev, pager, next" 
		        	   page-size='10'
		        	  :total="allPage" 
		        	>
		        </el-pagination>
		 	</el-row>
		 	
		 </div>
		 
		 <el-dialog title="添加店铺" :visible.sync="addStoreOpen" width='300px' center = 'true'>
		 	<el-form id='addStore'>
		 		<el-form-item label='店铺名称'>
		 			<el-input type='text' v-model='storeName' name='StoreName' placeholder='请输入店铺名称'></el-input>
		 		</el-form-item>
		 	</el-form>
		 	
		    <div slot="footer" class="dialog-footer">
			    <el-button :disabled='ifSubmit' type="primary" @click="addStoreGo">添加</el-button>
			</div>
		</el-dialog>
		
      </MainContent>
   </div>
</template>
<script>
	import MainContent from '../components/main_content'
	import global from './global'
	export default {
    name: "MyStore",
    inject:['reload'],
    mounted(){
    	this.initData('1');
    },
    data() {
    	return {
    		title: '商家管理',
    		storeListData: [],
    		addStoreOpen: false,
    		coinNum: '',
    		allPage: '',
    		currentPage: '1',
    		storeName: '',
    		ifSubmit: false,
    	}
    },
    components:{
    	MainContent
    },
    methods:{
    	initData(pageNum){
    		let _this = this;
    		global.$http({
						method:'get',
						url:global.urlAll+'PcBusinessStore/',
						headers:{
							'Content-Type':'application/x-www-form-urlencoded',
							'cache-control': 'no-cache, no-store',
							'Pragma': 'no-cache'
						},
						params:{
							BusinessId:$.cookie("userId"),
							Page: pageNum || '1',
							Row: 10
						}
					}).then((res)=>{
						if(res.data.Success == 'true'){
							_this.storeListData = res.data.Data;
							_this.allPage = res.data.DateNum;
						}
					})
    	},
    	addStore(){
    		this.addStoreOpen = true;
    		
    	},
    	addStoreGo(){
    		let _this = this;
    		this.ifSubmit = true;
    		if(_this.storeName == ''){
    			this.$message('请填写名称')
    		}else{
    			global.$http({
						method:'get',
						url:global.urlAll+'PcAddStores/',
						headers:{
							'Content-Type':'application/x-www-form-urlencoded',
							'cache-control': 'no-cache, no-store',
							'Pragma': 'no-cache'
						},
						params:{
							StoreName: _this.storeName,
							BusinessId : $.cookie('userId')
						}
					}).then((res)=>{
						_this.addStoreOpen = false;
						_this.ifSubmit = false;
						if(res.data.Success == 'true'){
							_this.storeName = '';
							_this.$message('添加成功');
							_this.initData();
							
						}else{
							_this.$message(res.msg)
						}
					})
			}
    	},
    	delectStore(index,row){
    		let _this = this;
    		let Id = row.StoreId;
    		this.$confirm('是否删除吗?', '提示', {
		         confirmButtonText: '确定',
		         cancelButtonText: '取消',
		         type: 'warning'
		       }).then(() => {
	    				global.$http({
							method:'get',
							url:global.urlAll+'PcDeleteStore/',
							headers:{
								'Content-Type':'application/x-www-form-urlencoded',
								'cache-control': 'no-cache, no-store',
								'Pragma': 'no-cache'
							},
							params:{
								StoreId: Id,
							}
						}).then((res)=>{
							if(res.data.Success == 'true'){
								_this.$message('删除成功');
								_this.initData();
								
							}else{
								_this.$message(res.msg)
							}
						})
					})
    	},
    	handleCurrentChange(val){
    		let _this = this;
    		this.currentPage = val;
    		this.initData(val)
    	}
    	
    }
   }
	
	
</script>

<style scoped="scoped">
	.content_title {
	padding-bottom: 30px;
    display: flex;
    justify-content: space-between;
    align-items: baseline;
    
  }
  .addBuss{
  	width: 150px;
  	height: 40px;
  	background: #1989FA;
  	color: #FFFFFF;
    font-weight: bold;
		margin-right:20px;
  }
  .table_content{
  	padding: 20px;
  	background: #FFFFFF;
  }
  tbody,thead {
	  width: 100% !important;
	}
	colgroup {
	  position: absolute;
	  width: 100% !important;
	  display: flex;
	}
	col {
	  flex: 1;
	  text-align: center;
	}
	.el-input1{
		height:36px;
		background:rgba(255,255,255,1);
		border:1px solid rgba(220,223,230,1);
		border-radius:4px;
		text-align: center;
	}
</style>